<%@ page language="java"  pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<base href="<%=basePath%>" />
<title>武汉科技大学  嵌入式实验室系统</title>
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
		<!-- stylesheets -->
		<link rel="stylesheet" type="text/css" href="resources/css/reset.css" />
		<link rel="stylesheet" type="text/css" href="resources/css/style.css" media="screen" />
		<link id="color" rel="stylesheet" type="text/css" href="resources/css/colors/blue.css" />
		<!-- gantte -->
		<link rel="stylesheet" href="css/gantte_style.css" />
        <link rel="stylesheet" href="css/bootstrap.css" />
        <link rel="stylesheet" href="css/prettify.css" />
		
		<!-- scripts (jquery) -->
		<script src="resources/scripts/jquery-1.8.2.js" type="text/javascript"></script>
		<!--[if IE]><script language="javascript" type="text/javascript" src="resources/scripts/excanvas.min.js"></script><![endif]-->
		<script src="resources/scripts/jquery-ui-1.8.custom.min.js" type="text/javascript"></script>
		<script src="resources/scripts/jquery.ui.selectmenu.js" type="text/javascript"></script>
		<script src="resources/scripts/jquery.flot.min.js" type="text/javascript"></script>
		<script src="resources/scripts/tiny_mce/tiny_mce.js" type="text/javascript"></script>
		<script src="resources/scripts/tiny_mce/jquery.tinymce.js" type="text/javascript"></script>
		<!-- scripts(gantte) -->
	
	<script src="resources/scripts/jquery.fn.gantt.js"></script>
	<script src="resources/scripts/bootstrap-tooltip.js"></script>
	<script src="resources/scripts/bootstrap-popover.js"></script>
	<script src="resources/scripts/prettify.js"></script>
		<!-- scripts (custom) -->
		<script src="resources/scripts/smooth.js" type="text/javascript"></script>
		<script src="resources/scripts/smooth.menu.js" type="text/javascript"></script>
		<!-- <script src="resources/scripts/smooth.chart.js" type="text/javascript"></script> -->
		<script src="resources/scripts/smooth.table.js" type="text/javascript"></script>
		<!-- <script src="resources/scripts/smooth.form.js" type="text/javascript"></script>
		<script src="resources/scripts/smooth.dialog.js" type="text/javascript"></script> -->
		<script src="resources/scripts/smooth.autocomplete.js" type="text/javascript"></script>
		<script type="text/javascript">
			$(document).ready(function () {
				style_path = "resources/css/colors";

				$("#date-picker").datepicker();

				$("#box-tabs, #box-left-tabs").tabs();
			});
     	$(function() {
		$.ajax({ //请求登录处理页
			url : "json/task!load", //登录处理页
			tppe : "get",
			dataType : "json",
			async : true,
			//传送请求数据
			success : function(data) { //登录成功后返回的数据
				//根据返回值进行状态显示
				$.each(data.data,function(i,v){
				$("tbody").append("<tr align='center'>"+
				"<td>"+v.t_id+"</td>"+
				"<td>"+v.t_name+"</td>"+
				"<td>"+v.t_desc+"</td>"+
				"<td>"+v.t_start+"</td>"+
				"<td>"+v.t_end+"</td>"+
				"<td>"+v.t_state+"</td>"+
				"<td>"+v.t_temp+"</td>"+
				"</tr>"); 
				 
				});
				
				tasks=data.data;
			  var jsonSource="[";
        
        
             var i;
             for(i=0;i<tasks.length-1;i++)
             {
                 
                //   tasks[i].t_start = tasks[i].t_start.replace(new RegExp("-","gm"),"/");
                  // tasks[i].t_end = tasks[i].t_end.replace(new RegExp("-","gm"),"/");
                   
                   
                 	jsonSource+="{\"name\":\""+tasks[i].t_name+"\",\"desc\":\""+tasks[i].t_desc+"\",";
                    var values="\"values\":[{\"from\":\"/Date("+(new Date(tasks[i].t_start)).getTime()+")\",\"to\":\"/Date("+(new Date(tasks[i].t_end)).getTime()+")\",\"label\":\""+tasks[i].t_state+"\",\"customClass\":\"ganttRed\"}]";
			        jsonSource+=values+"},";
		        	
             }
           //  tasks[i].t_start = tasks[i].t_start.replace(new RegExp("-","gm"),"/");
            //  tasks[i].t_end = tasks[i].t_end.replace(new RegExp("-","gm"),"/");
             jsonSource+="{\"name\":\""+tasks[i].t_name+"\",\"desc\":\""+tasks[i].t_desc+"\",";
           var values="\"values\":[{\"from\":\"/Date("+(new Date(tasks[i].t_start)).getTime()+")\",\"to\":\"/Date("+(new Date(tasks[i].t_end)).getTime()+")\",\"label\":\""+tasks[i].t_state+"\",\"customClass\":\"ganttRed\"}]";
	         jsonSource+=values+"}]";
          
			 
			
			 
			 
			 
			 "use strict";
			$(".gantt").gantt({
			    source: jsonSource,
				navigate: "scroll",
				scale: "weeks",
				maxScale: "months",
				minScale: "days",
				itemsPerPage: 10,
				onItemClick: function(data) {
					alert("Item clicked - show some details");
				},
				onAddClick: function(dt, rowId) {
					alert("Empty space clicked - add an item!");
				},
				onRender: function() {
					if (window.console && typeof console.log === "function") {
						console.log("chart rendered");
					}
				}
			});//end of gantt

			$(".gantt").popover({
				selector: ".bar",
				title: "I'm a popover",
				content: "And I'm the content of said popover."
			});
  
			prettyPrint();	
		
			 
			 
			 
			 
			 }
			 
			 
			 
			
				
				
				
				
				
				
				
            
		});
	});
		</script>
	</head>
	
		<!-- content -->
			<!-- content / right -->
			<div id="right">
				<!-- table -->
				<div class="box">
					<!-- box / title -->
					<div class="title">
						<h5>任务列表</h5>						
					</div>
					<!-- end box / title -->
					<div class="table">
						<form action="" method="post">
						<table>
							<thead>
								<tr>
									<th class="center">任务编号</th>
									<th>任务名称</th>
									<th>任务描述</th>
									<th>开始时间</th>
                                    <th>结束时间</th>
									<th>任务状态</th>
									<th>备注</th>																		
								</tr>
							</thead>
							<tbody>
											
							</tbody>
						</table>
						
						<!-- pagination -->
						<div class="pagination pagination-left">
                        
							<ul class="pager">
								<li class="disabled">&laquo; prev</li>
								<li class="current">1</li>
								<li><a href="http://www.hao123.com">2</a></li>
								<li><a href="">3</a></li>
								<li><a href="">4</a></li>
								<li><a href="">5</a></li>
								<li class="separator">...</li>
								<li><a href="">20</a></li>
								<li><a href="">21</a></li>
								<li><a href="">next &raquo;</a></li>
							</ul>
						</div>
						<!-- end pagination -->
						<!-- table action -->						
						<!-- end table action -->
						<div class="contain" >
		                 	<div class="gantt"></div>
                        </div>
						</form>
					</div>
				</div>
				<!-- end table --><!-- messages --><!-- end messages -->
				<!-- forms -->
			
				<!-- end forms -->
			</div>
			<!-- end content / right -->
		
	</body>
</html>